<template>
	<view class="cartmian">
		<view class="mianbox">
			<view class="mianleft">
				<view
					class="iconfont"
					@tap="ClicktapCollect"
					:class="isCollect==0 ?  'icon-icon-test56' :	'icon-icon-test57'"
				>
					<text>收藏</text>
				</view>
				<view class="iconfont icon-icon-test10"@tap="submit">
					<text>购物车</text>
					<text class="abtext" v-show="selectnum !== 0">
						{{ selectnum }}
					</text>
				</view>
			</view>
			<view class="mianright">
				<view @tap="handleAdd">加入购物车</view>
				<view @tap="submit">立即购买</view>
			</view>
		</view>
	</view>
</template>

<script >
export default{
	props:{
		selectnum:{
			type:Number,
			default:0
		},
		isCollect:{
			type:Number,
			default:0
		}
	},
	methods:{
	ClicktapCollect(){
		this.$emit('emCollect')
	},
	handleAdd(){
		this.$emit('handleAddCart')
	},
	submit(){
	uni.switchTab({
		url:'/pages/cart/cart'
	})
	}
	}
}
</script>

<style lang="scss">
.cartmian {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #fff;
	height: 50px;
	z-index: 99;
	.mianbox {
		display: flex;
		.mianleft {
			display: flex;
			view {
				position: relative;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				width: 50px;
				height: 50px;
				font-size: 20px;
				text {
					font-size: 12px;
				}
			}
			.abtext {
				position: absolute;
				content: '';
				top: -2px;
				right: 10px;
				background-color: red;
				color: #fff;
				border-radius: 90px;
				width: 16px;
				height: 16px;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}
		.mianright {
			display: flex;
			flex: 1;
			color: #fff;
			// height: 40px;
			margin: 5px 0;
			line-height: 40px;
			text-align: center;
			font-size: 14px;
			view:first-child {
				width: 50%;
				border-top-left-radius: 90px;
				border-bottom-left-radius: 90px;
				background-color: pink;
			}
			view:last-child {
				width: 50%;
				border-top-right-radius: 90px;
				border-bottom-right-radius: 90px;
				background-color: red;
			}
		}
	}
}
</style>
